<!--
 * @Description: CFA题库 -- cfa_content
 * @Author: your name
 * @Date: 2023-12-28
 * @LastEditTime: 2023-12-28
 * @LastEditors: Please set LastEditors
-->

<template>
  <div>
    <div class="online_Tutorial heart_w" :class="[{ have_case: change_class }]">
      <div class="test">
        <div class="header">
          <p>Question: {{ p_id + 1 }}</p>
          <div class="center" v-if="model == 1">
            <span>{{ timing }}</span>
          </div>
          <div class="right" v-if="model == 1">
            <el-button plain @click="finish_show = true">
              Finish Test
            </el-button>
            <el-button plain @click="saveShow = true">保存进度</el-button>
          </div>
        </div>
        <div class="centertitle">
          <p>Test: CFA Online Tutorial</p>
        </div>

        <!-- 做题模式 -->
        <div class="main" v-if="model == 1">
          <!-- <div v-show="!arrlen">暂时没有题目</div> -->
          <div class="main_left">
            <div class="btns_cont">
              <div
                class="inner_btnbox"
                v-for="(item, index) in itemobj"
                :key="index"
              >
                <el-button
                  size="mini"
                  :class="[
                    { test_btn: true },
                    { answered: item.user_answer },
                    { active: item.cid == p_id }
                  ]"
                  @click="tabs(item, index)"
                >
                  {{ index + 1 }}
                  <i
                    :class="[{ 'el-icon-arrow-up': true }, { up_t: true }]"
                    v-if="item.is_flag"
                  >
                  </i>
                </el-button>
                <div class="inner_btns" v-if="have_case">
                  <el-button
                    size="mini"
                    v-for="(it, i) in item.list"
                    :key="i"
                    @click="inner_tab(it, i)"
                    :class="[{ active: it.cid == p_id }]"
                  >
                    {{ i + 1 }}.{{ index + 1 }}
                  </el-button>
                </div>
              </div>
            </div>
          </div>

          <div class="rightbor">
            <div class="main_right">
              <div class="ques_list">
                <div class="ques_title" id="qstitle">
                  <div class="htbox" id="ques_text">v-html="item.case"</div>
                </div>
                55555 {{ topicarrobj.position }} -- {{ p_id }}
                <!-- 单选题 -->1
                <div class="options" v-if="!false">
                  <label
                    for=""
                    v-for="(item_set, index) in 3"
                    :key="index"
                    class="option_item"
                    @click="select_topic(item_set, index)"
                  >
                    <span>{{ letterarr[index] }}</span>
                    <div
                      class="option_contain"
                      :class="{ choosed: set_val == index }"
                    >
                      <div class="option_contain_main">name123</div>
                    </div>
                  </label>
                </div>

                <!-- 文本题 -->
                <div class="editor_box" v-if="false">
                  <quill-editor
                    v-model="user_answer"
                    @change="editor_change()"
                    class="editor"
                    ref="myTextEditor"
                    :options="editorOption"
                  >
                  </quill-editor>
                </div>
              </div>
            </div>
          </div>
        </div>

        <!-- 背题模式 -->
        <div class="main" v-if="model == 0">
          <div class="main_left">
            <div class="btns_cont">
              <div
                class="inner_btnbox"
                v-for="(item, index) in itemobj"
                :key="index"
              >
                <el-button
                  size="mini"
                  class="test_btn"
                  @click="tabs(item, index)"
                >
                  {{ index + 1 }}
                  <i
                    :class="[{ 'el-icon-arrow-up': true }, { up_t: true }]"
                    v-if="item.is_flag"
                  >
                  </i>
                </el-button>
                <div class="inner_btns" v-if="have_case">
                  <el-button
                    size="mini"
                    v-for="(it, i) in item.list"
                    :key="i"
                    @click="inner_tab(it, i)"
                  >
                    {{ i + 1 }}.{{ index + 1 }}
                  </el-button>
                </div>
              </div>
            </div>
          </div>
          <div class="rightbor">
            <div class="main_right">
              <!-- v-for="(item, index) in test_case"
              :key="index"
              v-show="p_id == index" -->
              <div class="ques_list">
                <div class="ques_title" id="qstitle">
                  <div class="htbox" id="ques_text">v-html="item.title"</div>
                </div>
                <div class="options">
                  <label
                    for=""
                    v-for="(items, indexs) in 4"
                    class="option_item"
                    :key="indexs + 'i'"
                  >
                    <span>{{ letterarr[indexs] }}</span>
                    <div class="option_contain" :class="{ choosed: items[0] }">
                      <div
                        class="option_contain_main"
                        style="user-select: none"
                      >
                        items.name
                      </div>
                    </div>
                  </label>
                </div>

                <!-- 文本题 -->
                <div class="editor_box" v-if="false">
                  <quill-editor
                    v-model="user_answer"
                    class="editor"
                    ref="myTextEditor"
                    :options="editorOption"
                  >
                  </quill-editor>
                </div>

                <div class="analysisBox">
                  <p>答案解析:</p>
                  <div class="ana_info" v-html="analysis"></div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="footer">
          <div class="left">
            <el-button
              type="success"
              size="medium"
              @click="correct_err_show = true"
            >
              纠错
            </el-button>
            <el-button
              type="success"
              size="medium"
              @click="addNote_show = true"
            >
              笔记
            </el-button>
            <el-button type="success" size="medium" @click="wd_show = true">
              答疑
            </el-button>
          </div>

          <div class="right_t">
            <el-button type="success" size="medium" @click="collect">
              收藏
            </el-button>
            <el-button
              type="success"
              size="medium"
              icon="el-icon-arrow-left"
              @click="pageback"
            >
              Back
            </el-button>
            <el-button type="success" size="medium" @click="nextpage">
              Next
              <i class="el-icon-arrow-right el-icon--right"></i>
            </el-button>
            <el-button type="success" size="medium" @click="BackList">
              BackList
            </el-button>
          </div>
        </div>
      </div>
    </div>

    <!-- case-html -->
    <div class="case_box" :class="{ act: zoom }" v-if="zoom_show">
      <div class="top" :class="{ case_top: zoom }">
        <h5>Case Scenario</h5>
        <img src="@/assets/images/fold.png" alt="折叠-展开" @click="zoom_out" />
      </div>
      <div class="main_case_box">
        <div class="inner" v-html="case_info"></div>
      </div>
    </div>

    <!-- 纠错 -->
    <transition name="leftToright">
      <div class="common_dialog jc_dialog" v-if="correct_err_show">
        <div class="inner_con">
          <div class="title">
            纠错
            <div class="close" @click="close_err"></div>
          </div>
          <div class="body">
            <p class="t_title">
              CFALevel II“甄”题库Economics(2024N) LM1 Currency Exchange Rates:
              Understanding Equilibrium Value
            </p>
            <div class="choose_box">
              <el-radio-group v-model="error_form.err_choose">
                <el-radio size="medium" label="0">答案错误</el-radio>
                <el-radio size="medium" label="1">功能问题</el-radio>
                <el-radio size="medium" label="2">错误解析</el-radio>
                <el-radio size="medium" label="3">判分错误</el-radio>
                <el-radio size="medium" label="4">排版错误</el-radio>
                <el-radio size="medium" label="5">其他</el-radio>
              </el-radio-group>
            </div>
            <textarea
              placeholder="感谢您的意见和体验感受，我们一定会快速解决您的..."
              class="jc_input"
              v-model="error_form.correct_info"
            >
            </textarea>
            <div class="concat">
              联系方式：
              <input
                placeholder="您的手机号"
                type="text"
                v-model="error_form.your_phone"
              />
            </div>
          </div>
          <div class="btm_btn">
            <button class="cancel" @click="close_err">取消</button>
            <button class="sure" @click="submit_err()">确定</button>
          </div>
        </div>
      </div>
    </transition>

    <!-- 笔记 -->
    <transition name="leftToright">
      <div class="mask_addNode" v-if="addNote_show">
        <div class="add_box">
          <div class="top">
            <p>title-标题</p>
            <button @click="get_notes(0)">我的笔记</button>
            <button @click="get_notes(1)">全网笔记</button>
          </div>
          <div class="add_info">
            <div class="ipt">
              <span>标题：</span>
              <input placeholder="输入标题" type="text" v-model="note_tit" />
              <p>是否公开：</p>
              <el-switch v-model="is_public"></el-switch>
            </div>
            <div class="ipt">
              <span> 笔记内容: </span>
              <textarea
                name=""
                cols="30"
                rows="10"
                placeholder="请输入笔记内容..."
                id="text_con"
                v-model="note_text"
              >
              </textarea>
            </div>
          </div>
          <div class="upd_box">
            <el-upload
              action="#"
              list-type="picture-card"
              :on-preview="imgPreview"
              :on-remove="handleRemove"
              :http-request="upload_img"
              :limit="3"
              :on-exceed="handleExceed"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
          </div>
          <div class="btns">
            <!-- <button class="submit_btn" @click="add_note">提交</button> -->
            <button class="submit_btn" @click="close_addNote">关闭</button>
          </div>
        </div>
      </div>
    </transition>
    <!-- 缩略图展示 -->
    <el-dialog :visible.sync="wd_preview_show">
      <img width="100%" :src="wd_preview_img" alt="缩略图" />
    </el-dialog>
    <!-- 笔记列表 -->
    <transition name="leftToright">
      <div class="note_box" v-if="note_show">
        <div class="note_list">
          <div class="top">
            <img
              src="https://www.rongyuejiaoyu.com/static/index/images/head5.jpg"
              alt="头像"
            />
            <button @click="get_notes(0)" v-if="!show_mynote">全网笔记</button>
            <button @click="get_notes(1)" v-else>我的笔记</button>
          </div>
          <div class="count">0条笔记</div>
          <div class="list_item">
            <div class="item" v-for="(item, index) in note_list" :key="index">
              <h5>{{ item.title }}</h5>
              <p>{{ item.content }}</p>
              <div
                style="display: flex; margin-top: 8px"
                v-if="item.note_images"
              >
                <img
                  style="width: 100px; height: 80px; margin-right: 10px"
                  :src="item"
                  alt=""
                  @click="show_big(item)"
                  v-for="(item, index) in item.note_images"
                  :key="index"
                />
              </div>
            </div>
          </div>
          <button class="close_btn" @click="note_show = false">关闭</button>
        </div>
      </div>
    </transition>

    <!-- 答疑 -->
    <transition name="leftToright">
      <div class="common_dialog ans_que" v-if="wd_show">
        <div class="inner_con">
          <div class="title">
            问答
            <div class="close" @click="close_wd"></div>
          </div>
          <div class="row">
            <button class="my_ans" @click="get_ask(1, 0)">我的提问</button>
            <button class="other_ans" @click="get_ask(0, 0)">全部问答</button>
          </div>
          <div class="que_tit">
            <input
              type="text"
              v-model="wd_tit"
              placeholder="请输入需要提问的标题"
            />
          </div>
          <div class="que_info">
            <textarea placeholder="请输入您要提问的内容" v-model="wd_info">
            </textarea>
          </div>
          <div class="upd_box">
            <el-upload
              action="#"
              list-type="picture-card"
              :on-preview="imgPreview"
              :on-remove="handleRemove"
              :http-request="upload_img"
              :limit="3"
              :on-exceed="handleExceed"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
          </div>
          <div class="btm_btns">
            <button @click="close_wd">取消</button>
            <button @click="submit_wd">保存</button>
          </div>
        </div>
      </div>
    </transition>
    <!-- 问答列表 -->
    <transition name="leftToright">
      <div class="common_dialog ask_box" v-if="ask_show">
        <div class="inner_box">
          <div class="top">
            <img
              src="https://www.rongyuejiaoyu.com/static/index/images/head5.jpg"
              alt="user_ava"
            />
            <!-- <h5 :title="ask_tit">{{ ask_tit }}</h5> -->
            <h5>ask_tit</h5>
            <button @click="ask_show = false">关闭</button>
          </div>
          <div class="tit_div">
            <p class="count">0条提问</p>
            <div class="type">
              <p :class="{ act_type: ask_type == 1 }" @click="get_ask(1, 1)">
                我的
              </p>
              <p :class="{ act_type: ask_type == 0 }" @click="get_ask(0, 1)">
                全部
              </p>
            </div>
          </div>
          <div class="list_item">
            <div class="item" v-for="(e, i) in ask_list" :key="i">
              <div class="top_con">
                <div class="avatar_box"><img :src="e.avatar" alt="" /></div>
                <div class="ana_box">
                  <p class="name">{{ e.username }}</p>
                  <p class="time">{{ e.new_add_time }}</p>
                  <p class="con">{{ e.question_title }}</p>
                </div>
              </div>
              <div class="img_box">
                <img
                  @click="show_big(item)"
                  :src="item"
                  alt=""
                  v-for="(item, index) in e.images"
                  :key="index"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </transition>

    <!-- 保存进度 -->
    <transition name="leftToright">
      <div class="mask-save" v-show="saveShow">
        <div class="kuang">
          <img
            src="https://www.rongyuejiaoyu.com/static/static/img/icon-pasue.c3aa006.png"
            alt="进度"
          />
          <p>保存进度，下次继续！</p>
          <div class="stopBtn">
            <div @click="saveRecord">保存</div>
            <div @click="save_hide">取消</div>
          </div>
        </div>
      </div>
    </transition>

    <!-- finish test -->
    <transition name="leftToright">
      <div class="common_dialog finishTest" v-if="finish_show">
        <div class="inner">
          <div class="header">
            <p>Confirm Finish</p>
          </div>
          <div class="main_text">
            <img src="@/assets/images/qm.png" alt="" />
            <p>Are you sure you would like to finish the test?</p>
          </div>
          <div class="btns">
            <button @click="submitTest">
              <img src="@/assets/images/sure.png" alt="" />
              <p>Finish</p>
            </button>
            <button @click="finish_show = false">
              <img src="@/assets/images/error_exit.png" alt="" />
              <p>Cancel</p>
            </button>
          </div>
        </div>
      </div>
    </transition>
  </div>
</template>

<script>
import { get_topic } from '@/api/CFApractice.js'
export default {
  name: 'cfa_content',
  data() {
    return {
      analysis:
        '<p>A&nbsp;</p><p>SSE = 4,320, SST = 9,105. RSS = 9,105 - 4,320 = 4,785. n = 65, k = 4.&nbsp;</p><p>R <sup>2</sup> = 4,785 / 9,105 = 0.53.&nbsp;</p><p><img src="http://www.rongyuejiaoyu.com/ueditor/php/upload/image/20231116/1700120405568409.png" title="1700120405568409.png" alt="image.png"/></p>',
      user_answer: '',
      editorOption: {
        placeholder: '请输入...',
        readyOnly: false, //是否只读
        modules: {
          toolbar: [
            ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
            [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
            ['blockquote', 'code-block'], // 引用  代码块
            ['image', 'link'], // 图片 链接
            [{ size: ['small', false, 'large', 'huge'] }] // 字体大小
          ]
        }
      },
      saveShow: false,
      finish_show: false,
      test_case: [],
      p_id: 0,
      case_info: {},
      set_val: {},
      letterarr: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
      model: '', // 1 做题模式 0背题模式
      tid: 0, //当前题目的tid
      answer: {},
      content: '',
      ask_list: [], // 问答列表
      ask_type: 1,
      ask_show: false,
      wd_show: false,
      wd_tit: '', // 问答标题
      wd_info: '', // 问答内容
      note_list: [], // 笔记列表
      filelist: [], // 文件上传列表
      wd_preview_show: false, // 控制打开变量
      wd_preview_img: '', // 缩略图文件
      note_text: '', // 笔记内容
      is_public: true, // 添加笔记是否公开
      note_tit: '', // 笔记标题
      error_form: {
        err_choose: '0', // 纠错/复选框
        correct_info: '', // 纠错/文本域
        your_phone: '' // 纠错/ 手机号
      },
      correct_err_show: false,
      addNote_show: false,
      note_show: false,
      show_mynote: false,
      have_case: false,
      zoom: false, // 控制case题显示位置 改
      zoom_show: false, // 控制case题显示
      change_class: false, // 控制题目显示位置
      seconds: 0,
      testTime: 0,
      timing: '00:00:00',
      Init: null,
      topicarr: [], // 请求返回的题目重组数组
      casearr: [], // 请求返回的case 题目 暂存数组
      textarr: [], // 请求返回的文本题暂存数组 text
      testarr: [], // 请求返回的单选题暂存数组list
      itemobj: [
        {
          cid: 103,
          option: 'Belgium',
          have_case: true,
          is_flag: true,
          list: [
            {
              cid: 101,
              option: 'Estonia'
            },
            {
              cid: 102,
              option: 'Ukraine'
            },
            {
              cid: 107,
              option: 'Ukraine'
            }
          ]
        },
        {
          cid: 106,
          have_case: false,
          is_flag: false,
          option: 'Estonia'
        },
        {
          cid: 108,
          have_case: false,
          is_flag: false,
          option: 'Ukraine'
        },
        {
          have_case: false,
          is_flag: false,
          cid: 117,
          option: 'Ukraine'
        }
      ],
      topicarrobj: {
        list: [
          {
            tid: 72615,
            cid: 10606,
            qst_type: 1,
            t_type: 1,
            is_case: 0,
            id: 72358,
            title:
              '<p>The adjusted R<sup>2</sup> of the full model is closest to:</p>',
            answer: 1,
            is_multi: '0',
            level: '1',
            op4: '',
            analysis:
              '<p>A&nbsp;</p><p>SSE = 4,320, SST = 9,105. RSS = 9,105 - 4,320 = 4,785. n = 65, k = 4.&nbsp;</p><p>R <sup>2</sup> = 4,785 / 9,105 = 0.53.&nbsp;</p><p><img src="http://www.rongyuejiaoyu.com/ueditor/php/upload/image/20231116/1700120405568409.png" title="1700120405568409.png" alt="image.png"/></p>',
            caseid: 0,
            vod_analysis: '',
            ms_analysis: '',
            sug_level: 0,
            thinking: '',
            is_true: -1,
            is_collection: false,
            caseinfo: null,
            op: ['0.50.', '0.53.', '0.67.'],
            user_op_: ['0.50.', '0.53.', '0.67.'],
            options: ['0.50.', '0.53.', '0.67.'],
            answerAnalize: false,
            lookanalysisString: '查看解析',
            chooseAnswerNums: -1,
            isChoose: false,
            islookAnaly: false,
            one: 1
          },
          {
            tid: 72616,
            cid: 10606,
            qst_type: 1,
            t_type: 1,
            is_case: 0,
            id: 72359,
            title:
              '<p>Which model is most likely to have the best goodness of fit?</p>',
            answer: 1,
            is_multi: '0',
            level: '1',
            op4: '',
            analysis:
              '<p>A</p><p>Lower values of the Bayesian information criteria (BIC) indicate better goodness of fit.&nbsp;</p><p><img src="http://www.rongyuejiaoyu.com/ueditor/php/upload/image/20231116/1700120464964514.png" title="1700120464964514.png" alt="image.png"/></p><p>The unrestricted or full model has a lower BIC, and thus a better goodness of fit.</p>',
            caseid: 0,
            vod_analysis: '',
            ms_analysis: '',
            sug_level: 0,
            thinking: '',
            is_true: -1,
            is_collection: false,
            caseinfo: null,
            op: [
              'The full model because it has a lower BIC.',
              'The full model because it has a lower AIC.',
              ' The reduced model because it has a lower BIC.'
            ],
            user_op_: [
              'The full model because it has a lower BIC.',
              'The full model because it has a lower AIC.',
              ' The reduced model because it has a lower BIC.'
            ],
            options: [
              'The full model because it has a lower BIC.',
              'The full model because it has a lower AIC.',
              ' The reduced model because it has a lower BIC.'
            ],
            answerAnalize: false,
            lookanalysisString: '查看解析',
            chooseAnswerNums: -1,
            isChoose: false,
            islookAnaly: false,
            one: 1
          }
        ],
        case: [
          {
            case_id: 1795,
            case_content:
              '<div><span style="font-family:"Microsoft YaHei";font-size:16px;">An analyst evaluates the sum of squared error and total sum of squares from a </span><span style="font-family:"Microsoft YaHei";font-size:16px;">multiple regression with four independent variables to be 4,320 and 9,105, </span><span style="font-family:"Microsoft YaHei";font-size:16px;">respectively. A restricted model excluding the last two variables has the sum of </span><span style="font-family:"Microsoft YaHei";font-size:16px;">squared errors of 5,105. There are 65 observations in the sample.</span></div>',
            list: [
              {
                tid: 72610,
                cid: 10606,
                qst_type: 1,
                t_type: 1,
                is_case: 1,
                id: 72353,
                title:
                  '<p><span style="font-family:&quot;Microsoft YaHei&quot;;font-size:16px;">The F-statistic for testing H0\n: b1 = b2 = b3 = b4 = 0 vs. Ha\n: at least one bj ≠ 0 is&nbsp;</span><span style="font-family:&quot;Microsoft YaHei&quot;;font-size:16px;">closest to:</span></p>',
                answer: 3,
                is_multi: '0',
                level: '1',
                op4: '',
                analysis:
                  '<p><span style="font-size:16px;font-family:&quot;Microsoft YaHei&quot;;">C&nbsp;</span></p><p><span style="font-size:16px;font-family:&quot;Microsoft YaHei&quot;;">RSS<sub>U</sub> = 9,105 - 4,320 = 4,785; k = 4; n = 65.</span></p><p><span style="font-size:16px;font-family:&quot;Microsoft YaHei&quot;;"><img src="https://img.rongyuejiaoyu.com/uploads/20231116/3b1227c690818d9fbef5167f06379784.png" alt=""/><br/></span></p>',
                caseid: 1795,
                vod_analysis: '',
                ms_analysis: '',
                is_true: -1,
                is_collection: false,
                op: ['13.54.', '13.77', '16.61.'],
                user_op_: ['13.54.', '13.77', '16.61.'],
                options: ['13.54.', '13.77', '16.61.'],
                answerAnalize: false,
                lookanalysisString: '查看解析',
                chooseAnswerNums: -1,
                isChoose: false,
                islookAnaly: false,
                one: 1
              },
              {
                tid: 72611,
                cid: 10606,
                qst_type: 1,
                t_type: 1,
                is_case: 1,
                id: 72354,
                title:
                  '<div><span style="font-family:&quot;Microsoft YaHei&quot;;font-size:16px;">The F-statistic for testing H0\r\n: b3 = b4 = 0 vs. Ha\r\n: at least one of b3 or b4 ≠ 0, is&nbsp;</span><span style="font-family:&quot;Microsoft YaHei&quot;;font-size:16px;">closest to:</span></div>',
                answer: 1,
                is_multi: '0',
                level: '1',
                op4: '',
                analysis:
                  '<p><span style="font-family:&quot;Microsoft YaHei&quot;;font-size:16px;"></span><span style="font-size:16px;">A&nbsp;</span></p><p><span style="font-size:16px;">SSE<sub>U</sub> = 4,320; SSE<sub>R</sub> = 5,105; n = 65; k = 4, q = 2.</span></p><p><span style="font-size:16px;"><img src="https://img.rongyuejiaoyu.com/uploads/20231116/9ee7885b99cd5847e7a4449b9fdd7fa1.png" alt="" /><br /></span></p><p><span style="font-size:16px;"><div>(Note: while not asked, for 5% signif icance and dof: q = 2, n - k - 1 = 60, the critical F-value = 3.15. Since F &gt; Fcritical\r\n, we reject the null hypothesis that the coeff icients for the last two variables are equal to zero.)</div><br /></span></p>',
                caseid: 1795,
                vod_analysis: '',
                ms_analysis: '',
                is_true: -1,
                is_collection: false,
                op: [' 5.45.', '12.2.', '392.'],
                user_op_: [' 5.45.', '12.2.', '392.'],
                options: [' 5.45.', '12.2.', '392.'],
                answerAnalize: false,
                lookanalysisString: '查看解析',
                chooseAnswerNums: -1,
                isChoose: false,
                islookAnaly: false,
                one: 1
              }
            ],
            count: 2
          }
        ],
        text: [],
        case_count: 2,
        model: 1,
        position: 0,
        use_time: 0,
        cate: [
          'CFA',
          'Level II“甄”题库',
          'Quantitative Methods',
          '(2024N) LM2 Evaluating Regression Model Fit and Interpreting Model Results   '
        ]
      }
    }
  },
  mounted() {
    let divElement = document.querySelector('body > div')
    let elediv = document.querySelector('div > div')
    divElement.style.height = '100%'
    elediv.style.height = '100%'
  },
  created() {
    this.get_practice()
    this.start()
    this.getopic()
    this.model = localStorage.getItem('model')
    console.log(localStorage.getItem('model'), '参数model')
    if (this.model == 0) {
      clearInterval(this.Init)
    }
  },
  methods: {
    getopic() {
      let _that = this
      let position_num = 0
      // list
      if (_that.topicarrobj.list.length && _that.topicarrobj.list.length > 0) {
        _that.testarr = _that.topicarrobj.list.map((ele, index) => {
          position_num++
          if (ele.position) {
            ele.position = ele.position
          } else {
            ele.position = position_num
          }
          _that.topicarr.push(ele)
          return ele
        })
        console.log(position_num, 'data.list', _that.topicarr)
      }

      // case
      if (_that.topicarrobj.case.length && _that.topicarrobj.case.length > 0) {
        _that.casearr = _that.topicarrobj.case.map((ele, index) => {
          _that.case_info = ele.case_content
          this.test_case = ele.list
          ele.list.map((it, index) => {
            position_num++
            if (it.position) {
              it.position = it.position
            } else {
              it.position = position_num
            }
            _that.topicarr.push(it)
            return it
          })
          return ele
        })
        console.log(_that.casearr, 'data.case', _that.topicarr)
      }
      // text
      if (_that.topicarrobj.text.length && _that.topicarrobj.text.length > 0) {
        _that.textarr = _that.topicarrobj.text.map((ele, index) => {
          position_num++
          if (ele.position) {
            ele.position = ele.position
          } else {
            ele.position = position_num
          }
          _that.topicarr.push(ele)
          return ele
        })
        console.log(_that.textarr, 'data.text', _that.topicarr)
      }
    },

    async get_practice() {
      const params = {
        token: this.$store.state.token,
        cid: 10606,
        type: 1
      }
      const { data: data } = await get_topic(params)
      if (data.code == 1) {
        console.log(data.data, '333333333333')
      } else {
        this.$message.error(data.msg)
      }
    },
    BackList() {
      clearInterval(this.Init)
      this.$router.push({
        path: '/exam_practice/CFA/questionbank',
        query: { cid: localStorage.getItem('upcateid') }
      })
    },
    select_topic(it, index) {
      this.set_val = index
      console.log(213)
    },

    editor_change(e) {
      // if (e.user_answer.length > 0) {
      //   e.is_true = 2
      // }
      console.log(3333, this.user_answer)
    },
    start() {
      this.Init = setInterval(this.timers, 1000)
    },
    timers(num) {
      if (num) {
        this.seconds = this.testTime
      }
      this.seconds++
      var second = this.seconds % 60
      var minute = parseInt(this.seconds / 60) % 60
      var hour = parseInt(this.seconds / 3600)
      this.timing = `${hour < 10 ? '0' + hour : hour}:
      ${minute < 10 ? '0' + minute : minute}:
      ${second < 10 ? '0' + second : second}`

      // console.log('计时', this.timing)
    },
    tabs(it, i) {
      if (it.have_case) {
        this.have_case = !this.have_case
        console.log(i, '77777')
      } else {
        this.p_id = it.cid
        this.change_class = false
        this.zoom_show = false
        console.log(i, '索引', it.cid)
      }
    },
    inner_tab(it, index) {
      this.p_id = it.cid
      console.log(it.cid, 222222222, index)
      this.change_class = true
      this.zoom_show = true
    },
    zoom_out() {
      this.zoom = !this.zoom
      this.change_class = !this.change_class
      this.zoom_show = true
    },
    close_err() {
      // 纠错
      this.correct_err_show = false
      this.error_form.correct_info = ''
      this.error_form.your_phone = ''
      this.error_form.err_choose = '0'
    },
    //纠错 /-确认
    submit_err() {
      if (!this.error_form.correct_info) {
        this.$message.warning('请输入意见或建议')
        return -1
      }
      const err_data = {
        tid: this.tid,
        type: this.error_form.err_choose,
        res: this.error_form.correct_info,
        mobile: this.error_form.your_phone
      }

      // getjiucuo(err_data).then((res) => {
      //   if (res.data.code == 1) {
      //     this.correct_err_show = false
      //     this.$message.success('提交成功')
      //   }
      // })
    },
    // 全网笔记/ 我的笔记
    get_notes(id) {
      this.addNote_show = false
      this.note_show = true
      if (id == 0) {
        this.show_mynote = true
      } else {
        this.show_mynote = false
      }
    },
    // 关闭
    close_addNote() {
      this.note_tit = ''
      this.note_text = ''
      this.filelist = []
      this.addNote_show = false
    },
    imgPreview(file) {
      console.log(file, '888888888')
      this.wd_preview_img = file.url
      this.wd_preview_show = true
    },
    handleRemove(file) {
      this.filelist.pop()
    },
    upload_img(res) {
      console.log(res, '22222222')
      this.filelist.push(res.file)
    },
    handleExceed() {
      this.$message.warning('最多上传三张图片！')
    },

    collect() {
      // let datas = {
      //   cid: this.cid,
      //   tid: this.test_case[this.p_id].tid,
      //   from: 2
      // }
      this.$message({
        message: '恭喜你，这是一条成功消息',
        type: 'success'
      })
      console.log(22222222)
      /*   addcollectacca(datas).then((res) => {
        // console.log(res)
        if (res.data.code == 1) {
          if (this.test_case[this.p_id].is_collection) {
            this.$message.success('取消收藏')
          } else {
            this.$message.success('收藏成功')
          }
          this.test_case[this.p_id].is_collection =
            !this.test_case[this.p_id].is_collection
        }
      }) */
    },

    close_wd() {
      this.wd_tit = ''
      this.wd_info = ''
      this.filelist = []
      this.wd_show = false
    },

    // 我的提问/ 我的问答
    get_ask(id, is_open) {
      if (!is_open) {
        this.wd_show = false
        this.ask_show = true
      }
      this.ask_type = id
    },
    // 答疑保存
    submit_wd() {},

    // back按钮
    pageback() {},
    // next按钮
    nextpage() {
      this.p_id++
      console.log(this.p_id, '55555555')

      // if (this.p_id == this.test_case.length - 1) return
      // if (this.test_case.length > 0 && this.test_case[this.p_id - 1].is_case) {
      //   this.change_class = true
      //   this.zoom_show = true
      //   if (this.zoom) {
      //     this.change_class = false
      //     return -1
      //   }
      //   this.zoom = false
      // } else {
      //   // 改
      //   this.change_class = false
      //   this.zoom_show = false
      // }
    },

    // 保存进度/保存
    saveRecord() {},
    // 保存进度/取消
    save_hide() {
      this.saveShow = false
    },
    // finishTest 完成
    submitTest() {
      this.$router.push({ name: 'CFAReport' })
      console.log(this.seconds)
    }
  }
}
</script>

<style scoped lang="scss">
@import '@/assets/styles/index.scss';
@import '@/assets/styles/cfa_practice.scss';

.online_Tutorial {
  height: 100%;
  overflow-y: auto;
}
</style>
